  $(document).ready(function(){
    $(".a_1").click(function(){
      $("#span_1").css("display", "inline-block");
      $("#span_2").css("display", 'none');
      $("#span_3").css("display", 'none');
      $("#span_4").css("display", 'none');
      $("#span_5").css("display", 'none');
      $("#span_6").css("display", 'none');
      $(".a_1").css("color", "#1e90ff");
      $(".a_2,.a_3,.a_4,.a_5,.a_6").css("color", "#708090");
    });
    $(".a_2").click(function(){
      $("#span_1").css("display", 'none');
      $("#span_2").css("display", "inline-block");
      $("#span_3").css("display", 'none');
      $("#span_4").css("display", 'none');
      $("#span_5").css("display", 'none');
      $("#span_6").css("display", 'none');
      $(".a_2").css("color", "#1e90ff");
      $(".a_1,.a_3,.a_4,.a_5,.a_6").css("color", "#708090");
    });
    $(".a_3").click(function(){
      $("#span_1").css("display", 'none');
      $("#span_2").css("display",  'none');
      $("#span_3").css("display", "inline-block");
      $("#span_4").css("display", 'none');
      $("#span_5").css("display", 'none');
      $("#span_6").css("display", 'none');
      $(".a_3").css("color", "#1e90ff");
      $(".a_2,.a_1,.a_4,.a_5,.a_6").css("color", "#708090");
    });
    $(".a_4").click(function(){
      $("#span_1").css("display", 'none');
      $("#span_2").css("display", 'none');
      $("#span_3").css("display", 'none');
      $("#span_4").css("display", "inline-block");
      $("#span_5").css("display", 'none');
      $("#span_6").css("display", 'none');
      $(".a_4").css("color", "#1e90ff");
      $(".a_2,.a_3,.a_1,.a_5,.a_6").css("color", "#708090");
    });
    $(".a_5").click(function(){
      $("#span_1").css("display", 'none');
      $("#span_2").css("display", 'none');
      $("#span_3").css("display", 'none');
      $("#span_4").css("display", 'none');
      $("#span_5").css("display", "inline-block");
      $("#span_6").css("display", 'none');
      $(".a_5").css("color", "#1e90ff");
      $(".a_2,.a_3,.a_4,.a_1,.a_6").css("color", "#708090");
    });
    $(".a_6").click(function(){
      $("#span_1").css("display", 'none');
      $("#span_2").css("display", 'none');
      $("#span_3").css("display", 'none');
      $("#span_4").css("display", 'none');
      $("#span_5").css("display", 'none');
      $("#span_6").css("display", "inline-block");
      $(".a_6").css("color", "#1e90ff");
      $(".a_2,.a_3,.a_4,.a_5,.a_1").css("color", "#708090");
    });
  });
  $(document).ready(function(){
    $(".image-1").mouseover(function(){
      $(".image-1").css({"background-color":"#1e90ff","background-image":"url('../css/image/image-transparent-1.png')"});
      $(".words-1").css("color", "#1e90ff");
    });
    $(".image-1").mouseout(function(){
      $(".image-1").css({"background-color":"#fff","background-image":"url('../css/image/image-1.png')"});
      $(".words-1").css("color", "#708090");
    });
    $(".image-2").mouseover(function(){
      $(".image-2").css({"background-color":"#1e90ff","background-image":"url('../css/image/image-transparent-2.png')"});
      $(".image-1").css({"background-color":"#fff","background-image":"url('../css/image/image-1.png')"});
      $(".words-2").css("color", "#1e90ff");
      $(".words-1").css("color", "#708090");
    });
    $(".image-2").mouseout(function(){
      $(".image-2").css({"background-color":"#fff","background-image":"url('../css/image/image-2.png')"});
      $(".words-2").css("color", "#708090");
    });
    $(".image-3").mouseover(function(){
      $(".image-3").css({"background-color":"#1e90ff","background-image":"url('../css/image/image-transparent-3.png')"});
      $(".image-1").css({"background-color":"#fff","background-image":"url('../css/image/image-1.png')"});
      $(".words-3").css("color", "#1e90ff");
      $(".words-1").css("color", "#708090");
    });
    $(".image-3").mouseout(function(){
      $(".image-3").css({"background-color":"#fff","background-image":"url('../css/image/image-3.png')"});
      $(".words-3").css("color", "#708090");
    });
    $(".image-4").mouseover(function(){
      $(".image-4").css({"background-color":"#1e90ff","background-image":"url('../css/image/image-transparent-4.png')"});
      $(".image-1").css({"background-color":"#fff","background-image":"url('../css/image/image-1.png')"});
      $(".words-4").css("color", "#1e90ff");
      $(".words-1").css("color", "#708090");
    });
    $(".image-4").mouseout(function(){
      $(".image-4").css({"background-color":"#fff","background-image":"url('../css/image/image-4.png')"});
      $(".words-4").css("color", "#708090");
    });
    $(".image-5").mouseover(function(){
      $(".image-5").css({"background-color":"#1e90ff","background-image":"url('../css/image/image-transparent-5.png')"});
      $(".image-1").css({"background-color":"#fff","background-image":"url('../css/image/image-1.png')"});
      $(".words-5").css("color", "#1e90ff");
      $(".words-1").css("color", "#708090");
    });
    $(".image-5").mouseout(function(){
      $(".image-5").css({"background-color":"#fff","background-image":"url('../css/image/image-5.png')"});
      $(".words-5").css("color", "#708090")
    });
    $(".image-6").mouseover(function(){
      $(".image-6").css({"background-color":"#1e90ff","background-image":"url('../css/image/image-transparent-6.png')"});
      $(".image-1").css({"background-color":"#fff","background-image":"url('../css/image/image-1.png')"});
      $(".words-6").css("color", "#1e90ff");
      $(".words-1").css("color", "#708090");
    });
    $(".image-6").mouseout(function(){
      $(".image-6").css({"background-color":"#fff","background-image":"url('../css/image/image-6.png')"});
      $(".words-6").css("color", "#708090")
    });
  })
$(document).ready(function(){
 $("#marketing-left").mouseover(function(){
   $("#marketing-left").css("background-color", "#1e90ff");
   $("#marketing-left span").css("background-image","url('../css/image/right-white.png')");
   $(".marketing-left-h3").css("color", "#fff");
   $(".marketing-left-p").css("color", "#fff");
   $("#marketing-right").css("background-color", "#fff");
   $(".marketing-right-h3").css("color", "#05173b");
   $(".marketing-right-p").css("color", "#708090");
   $("#marketing-right span,.lower-left span,.bottom-right span").css("background-image","url('../css/image/right.png')");
   $(".lower-left,.bottom-right").css("background-color", "#fff");
   $(".lower-left-h3,.bottom-right-h3").css("color", "#05173b");
   $(".lower-left-p,.bottom-right-p").css("color", "#708090");
 });
 $("#marketing-right").mouseover(function(){
  $("#marketing-left").css("background-color", "#fff");
  $(".marketing-left-h3").css("color", "#05173b");
  $(".marketing-left-p").css("color", "#708090");
  $("#marketing-right span").css("background-image","url('../css/image/right-white.png')");
  $("#marketing-right").css("background-color", "#1e90ff");
  $(".marketing-right-h3").css("color", "#fff");
  $(".marketing-right-p").css("color", "#fff");
  $("#marketing-left span,.lower-left span,.bottom-right span").css("background-image","url('../css/image/right.png')");
  $(".lower-left,.bottom-right").css("background-color", "#fff");
  $(".lower-left-h3,.bottom-right-h3").css("color", "#05173b");
  $(".lower-left-p,.bottom-right-p").css("color", "#708090");
 });
 $(".lower-left").mouseover(function(){
   $(".lower-left").css("background-color", "#1e90ff");
   $(".lower-left span").css("background-image","url('../css/image/right-white.png')");
   $(".lower-left-h3").css("color", "#fff");
   $(".lower-left-p").css("color", "#fff");
   $("#marketing-left").css("background-color", "#fff");
   $(".marketing-left-h3").css("color", "#05173b");
   $(".marketing-left-p").css("color", "#708090");
   $("#marketing-right").css("background-color", "#fff");
   $(".marketing-right-h3").css("color", "#05173b");
   $(".marketing-right-p").css("color", "#708090");
   $("#marketing-right span,#marketing-left span,.bottom-right span").css("background-image","url('../css/image/right.png')");
   $(".bottom-right,#marketing-right,#marketing-left").css("background-color", "#fff");
   $(".bottom-right-h3,.marketing-right-h3").css("color", "#05173b");
   $(".bottom-right-p,.marketing-right-p").css("color","#708090");
 });
 $(".bottom-right").mouseover(function(){
   $(".bottom-right").css("background-color", "#1e90ff");
   $(".bottom-right span").css("background-image","url('../css/image/right-white.png')");
   $(".bottom-right-h3,.bottom-right-p").css("color", "#fff");
   $(".lower-left,#marketing-left,#marketing-right").css("background", "#fff");
   $("#marketing-right span,#marketing-left span,.lower-left span").css("background-image","url('../css/image/right.png')");
   $(".lower-left-h3,.marketing-left-h3,.marketing-right-h3").css("color", "#05173b");
   $(".lower-left-p,.marketing-left-p,.marketing-right-p").css("color", "#708090");
 });
 $(".bottom-right").mouseout(function(){
  $(".bottom-right span").css("background-image","url('../css/image/right.png')");
 });
});
//动画效果
$(document).ready(function(){
 $(window).scroll(function(){
  var rollingDistance = $(window).scrollTop();
  if(rollingDistance == 'undefined'){
    $(".left,.right,.image-1,.image-2,.image-3,.image-4,.image-5,.image-6").css("animation-play-state", "running");
   
  }
  if(rollingDistance >= 500){
    $(".marketing>h2,.marketing .down").css("animation-play-state", "running");
  }
   if(rollingDistance >= 700){
    $(".marketing .left,.marketing .right").css("animation-play-state", "running")
   }
   if(rollingDistance >= 900){
     $(".marketing .notebook").css("animation-play-state", "running");
   }
   if(rollingDistance >= 1400){
     $(".lower-left,.bottom-right").css("animation-play-state", "running")
     $(".fixed").css("display", "block")
   }
   else{
    $(".fixed").css("display", "none")
   }
   if(rollingDistance >= 1700){
     $(".down-1,.serve>h2,.serve>p").css("animation-play-state", "running");
   }
   if(rollingDistance >= 1800){
     $(".submodule-1,.submodule-2,.submodule-3,.submodule-4,.submodule-5,.submodule-6").css("animation-play-state", "running");
   }
   if(rollingDistance >= 2800){
     $(".down-2,.hosting>h2,.hosting>p").css("animation-play-state", "running");
   }
   if(rollingDistance >= 3000){
     $(".hosting .image").css("animation-play-state", "running");
   }
   if(rollingDistance >= 3800){
     $(".down-3,.client>h2").css("animation-play-state", "running");
   }
   if(rollingDistance >= 4000){
     $(".icon").css("animation-play-state", "running");
   }
   if(rollingDistance >= 5337){
     $(".contact>h2,.down-4").css("animation-play-state", "running");
   }
   if(rollingDistance >= 5537){
     $(".commerce,.channel,.address").css("animation-play-state", "running");
   }
 })
})